// 公共部分

body {
  // -webkit-filter: grayscale(100%);
  // -moz-filter: grayscale(100%);
  // -ms-filter: grayscale(100%);
  // -o-filter: grayscale(100%);
  // filter: grayscale(100%);
  // filter: gray;
  // padding-top: 90px;
}

.jgys{
    justify-content: space-between;
    li{
        width: 300px;
    height: 323px;
    border: 1px solid #eee;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    text-align: center;
    padding: 0 53px;
    &:hover{
        .title{
            color: #3490de;
        }
    }
    .title{
        font-size: 24px;
        color: #333;
        margin-bottom: 20px;
    }
    .hx{
        width: 36px;
        height: 2px;
        background: #3490de;
        margin: 0 auto;
        margin-bottom: 48px;
    }
    .ms{
        font-size: 16px;
        line-height: 26px;
        color: #666;
    }
    img{
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    }
    
}

.list_ul {
  overflow: hidden;

  ul {
    display: flex;
    flex-wrap: wrap;

    li {
      box-sizing: border-box;

      a {
        display: block;
      }
    }
  }
}
@font-face {
  font-family: kisn;
  src: url(../font/KISN.TTF);
}
.fen {
  font-family: kisn;
}
@color: #000;
@bjcolor: #eef2f6;
.head_pc {
  width: 100%;
  z-index: 222;
  background: #fff;
  .con1600 {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .nav {
    display: flex;
    align-items: center;
    ul {
      display: flex;
      align-items: center;
      li {
        position: relative;
        .active {
          display: block;
          padding: 0 40px;
          font-size: 18px;
          line-height: 90px;
          // color: #fff;
          position: relative;
          &::after {
            width: 76px;
            height: 5px;

            position: absolute;
            content: "";
            left: 50%;
            transform: translateX(-50%);
            bottom: 0;
            .transition;
          }
          &:hover::after,
          &.hover::after {
            background-color: #3490de;
            color: @color;
          }
          &:hover,
          &.hover {
            color: @color;
          }
        }

        .ul2 {
          position: absolute;
          left: 50%;
          transform: translateX(-50%);
          min-width: 100%;
          background: rgba(0, 0, 0, 0.5);
          display: none;
          a {
            font-size: 16px;
            display: block;
            line-height: 40px;
            width: 100%;
            // overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            text-align: center;
            color: #fff;
            &:hover,
            &.hover {
              background-color: @color;
              color: #fff;
            }
          }
        }
      }
    }
  }

  .langs{
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 0 40px;
    a{
      padding: 0 !important;
    }
    div{
      background: url('../images/en.png') no-repeat left center;
      padding: 0 !important;
    padding-left: 36px !important;
    color: #000;
    width: 100%;
    display: block;
    &:hover{
      color: #fff;
    }
    }
    &:hover{
      background: #3490de;
      div{
        background: url('../images/en2.png') no-repeat left center;
        color: #fff;
      }
    }
    
  }
}
.index_banner {
  .main {
    padding: 113px 0 180px 0;
    color: #fff;
    position: relative;
    &::after{
      display: block;
      content: '';
      clear: both;
    }
    .left{
      position: absolute;
      padding-top: 110px;
      z-index: 2;
      .etitle{
        font-size: 85px;
        line-height: 85px;
        margin-bottom: 54px;
        span{
          color: @color;
        }
      }
      .ctitle{
        font-size: 37px;
        line-height: 58px;
        margin-bottom: 58px;
      }
      .ms{
        font-size: 20px;
        line-height: 20px;
        margin-bottom: 48px;
      }
      
      .xq{
        display: flex;
        align-items: center;
        margin-bottom: 113px;
        .fa{
          font-size: 34px;
        }
    
        .yuan{
          width: 30px;
          height: 30px;
          border: 1px solid #fff;
          border-radius: 50%;
          margin-left: -20px;
        }
      }

      .slt{
        display: flex;
        align-items: center;
        .thumbs{
          width: 35%;
        }
        .thumbs ul .swiper-slide{
          cursor: pointer;
        }
        .hx{
          width: 8.3%;
          border-bottom: 1px solid #f5d2c6;
          margin-left: 2px;
          height: 0;
          margin-right: 1.8%;
        }
        .sz{
          display: flex;
          font-size: 14px;
          width: 7.6%;
          justify-content: space-between;
          .active{
            transform: scale(1.5);
          }
        }
      }
    }

    .right{
      float: right;
      width: 64%;
    }
  }
}

.transition {
  transition: all ease-in-out 0.3s;
}

.img-transform {
  -webkit-transform: scale(1.03);
  -moz-transform: scale(1.03);
  -ms-transform: scale(1.03);
  -o-transform: scale(1.03);
  transform: scale(1.03);
}

.big_img {
  .img {
    overflow: hidden;

    img,
    h1,
    h2,
    h3,
    h4,
    h5 {
      .transition;
    }
  }

  &:hover img {
    .img-transform;
  }

  &:hover h1,
  &:hover h2,
  &:hover h3,
  &:hover h4 &:hover h5 {
    color: @color;
  }
}

// .con1500 {
//     max-width: 1500px;
//     width: 100%;
//     margin: 0 auto;
// }

.con1400 {
  max-width: 1554px;
  width: 100%;
  margin: 0 auto;
}

.con1300 {
  max-width: 1300px;
  width: 100%;
  margin: 0 auto;
}

.con1200 {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

.con1600 {
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

// 公共结束
.con1500 {
  max-width: 1550px;
  width: 100%;
  margin: 0 auto;
}


// 头部开始

p {
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
}

.public_padding {
  padding-bottom: 150px;
}


.head_pc {
  .con1600{
    align-items: center;
  }
  position:fixed;
  width:100%;
  background:#fff;
  z-index: 999;
  box-shadow: 0 0 12px -7px;
  .nav {
    display: flex;
    align-items: center;
    ul {
      display: flex;
      align-items: center;
      li {
        a {
          display: block;
          padding: 0 40px;
          font-size: 18px;
          line-height: 90px;
          color:#000;

          position: relative;
          &.hover,
          &:hover {
            color: @color;
          }

          
          }
      }
    }
  }

  .lng {
    a {
      display: flex;
      align-items: center;
      justify-content: space-between;
      line-height: 36px;

      font-size: 18px;
      text-align: center;
      padding: 0 10px;
      border-radius: 36px;
      img {
        max-width: 30px;
        object-fit: cover;
      }
      p {
        padding-left: 10px;
      }
    }
  }
}

.pub_flex {
  display: flex;
}

.dsuojin {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.index_banner{
}

.index_about{
  background: url('../images/index_ab_bg.png') no-repeat;
  background-size: 50% auto;
  .con1600{
    position: relative;
    .right{
      .pub_title{
        text-align: left;
        margin-top: 165px;
      }
      width: 42%;
      .content{
        font-size: 18px;
        color: #333;
        line-height: 41px;
        margin-bottom: 118px;
        font-weight: lighter;
      }

      .about_link{
        display: flex;
        justify-content: space-between;
        li{
          width: 31%;
          border: 1px solid #eeeeee;
          height: 132px;
          a{
            width: 100%;
            height: 100%;
            display: flex;
          justify-content: center;
          align-items: center;
          flex-direction: column;
          font-size: 16px;
            color: #999;
            font-weight: lighter;
            &:hover{
              transform: translateY(5px);
              transition: all .2s;
            }
          .active{
            display: none;
          }
          &:hover{
            color: #3490de;
            .normal{
              display: none;
            }
            .active{
              display: block;
            }
          }
          img{
            margin-bottom: 19px;
          }
          }
        }
      }
    }
    .left{
      z-index: 999;
      width: 41%;
      margin-top: 660px;
      ul{
        display: flex;
        justify-content: space-between;
        margin-bottom: 170px;
        width: 100%;
        li{
          font-size: 78px;
          color: #fff;
          display: flex;
          flex-direction: column;
          align-items: center;
          position: relative;
            span{
              font-size: 16px;
              font-weight: lighter;
            }
        }
        .fa-plus:before{
          font-size: 24px;
          position: absolute;
          top: 17px;
          right: -17px;
        }
      }
    }
  }
  &.active{
    .left{
      animation: 1s bounceInLeft both;
      li{
          &:nth-child(1){
              animation: 1s fadeInUp both;
          }
          &:nth-child(2){
              animation: 1.2s fadeInUp both;
          }
          &:nth-child(3){
              animation: 1.4s fadeInUp both;
          }
      }
    }
    .right{
      animation: 1s bounceInRight both;
      li{
          &:nth-child(1){
              animation: 1s fadeInUp both;
          }
          &:nth-child(2){
              animation: 1.2s fadeInUp both;
          }
          &:nth-child(3){
              animation: 1.4s fadeInUp both;
          }
      }
    }
  }
}

.index_product{
    background: linear-gradient(#fff, #fff) no-repeat, linear-gradient(#aee1f8, #fff);
    background-size: 100% 54%;
  &.active{
    .content{
      animation: 1s bounceInUp both;
      li{
          transition: .6s;
    overflow: hidden;
    &.active{
        .title{
            background: #4b9fe1 !important;
        }
    }
          &:nth-child(1){
              animation: 1s fadeInUp both;
          }
          &:nth-child(2){
              animation: 1.3s fadeInUp both;
          }
      }
    }
  }
  .wrap{
    padding: 136px 0 50px;
    animation: 1s .4s fadeInLeft both;
  }
  .content{
    display: flex;
    justify-content: space-around;
    margin-bottom: 50px;
    a{
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      font-size: 16px;
      color: #333;
      .img_wrap{
          width: 100%;
    text-align: center;
    overflow: hidden;
      }
      span{
        position: absolute;
        bottom: 17px;
        font-size: 16px;
        color: #333;
        font-weight: lighter;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
        width: 90%;
        text-align: center;
      }
      &:hover{
        img{
          transform: scale(1.1);
          overflow: hidden;
          transition: 1s;
        }
        ~.title{
            border-bottom:1px solid #3490de;
        }
      }
    }
  }
  .more{
    font-size: 18px;
    color: #484848;
    padding: 0 106px;
    border: 1px solid #d2d2d2;
    line-height: 66px;
    width: fit-content;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    font-weight: lighter;
    &:hover{
      color: #fff !important;
      background: #3490de;
    }
    // margin-bottom: 106px;
  }
}

.index_enterprise{
  background: url('../images/index_enterprise.png') no-repeat;
  background-size:100% 100%;
  .video_wrap{
      flex-wrap: wrap;
      align-items: space-between;
      li{
          width: 40%;
          height: 200px;
          background: #fff;
          box-shadow: 0 0 10px #fff;
          border-radius: 10px;
          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 0 26px;
          &:hover{
              box-shadow: 0 0 10px #3490de;
              .title{
                  color: #3490de !important;
              }
          }
          .right{
              margin-right: 74px;
              .title{
                  font-size: 24px;
                  color: #333;
                  text-align: left;
                  margin-bottom:12px;
              }
              .hx{
                  width: 36px;
                  height: 2px;
                  background: #3490de;
              }
              .ms{
                  font-size: 18px;
                  color: #666;
                  margin-top: 28px;
              }
          }
      }
  }
  &.active{
    .video_wrap{
      animation: 1s bounceInUp both;
    }
  }
  .wrap{
    padding: 136px 0 50px;
  }
  .pub_title{
    .etitle{
      color: #fff;
    }
    .ctitle{
      color: #fff;
    }
  }
  .video_wrap{
    position: relative;
  }
  .video_wrap{
    cursor: pointer;

  }
  .play{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%;-50%);
    font-size: 32px;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    // &:hover{
    //     transform: translate(-50%;-70%);
    // }


    img{
      margin-bottom: 32px;
    }
  }
}

.index_news{
  display: flex;
  flex-direction: column;
  justify-content: center;
  &.active{
    .pub_title{
      animation: 1s fadeIn both;
    }
    .pub_news{
      animation: 1s bounceInUp both;
    }
    li{
        &:nth-child(1){
              animation: 1s fadeInUp both;
          }
          &:nth-child(2){
              animation: 1.2s fadeInUp both;
          }
          &:nth-child(3){
              animation: 1.4s fadeInUp both;
          }
          &:nth-child(4){
              animation: 1.6s fadeInUp both;
          }
    }
  }
  .wrap{
    padding: 136px 0 50px;
  }
}

.pub_news{
  margin-bottom: 62px;
  .title{
    overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
  }
  ul{
    display: flex;
    justify-content: space-between;
    width: 100%;
    a{
      height: 469px;
      position: relative;
      display: flex;
      flex-direction: column;
      font-size: 18px;
      font-weight: lighter;
      padding: 29px 26px 0;
      background: #eee;
      img{
        margin-bottom: 36px;
      }
      i{
        position: absolute;
        bottom: 33px;
        color: #9d9d9d;
      }
      span{
        margin-bottom: 14px;
      }
      &:hover{
        background: #3490de;
        color: #fff;
        i{
          color: #fff;
        }
      }
    }
  }
  .more{
    &:hover{
      color: #fff !important;
    background: #3490de;
    }
  }
}

.pub_title{
  text-align: center;
  .etitle{
    font-size: 60px;
    color: #3490de;
  }
  .ctitle{
    font-size: 36px;
    color: #000;
    font-weight: lighter;
    margin-bottom: 52px;
  }
}

.pub_news {
  flex-direction: column;
  .content {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    li {
      width: 32.7%;
      padding: 29px 36px;
      border: 1px solid #f3f3f3;
      &:hover{
        .cover{
          opacity: 1;
        }
      }
      .cover{
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        transition: all 0.5s 0s ease-in-out;
        .time{
          position: absolute;
          left: 0;
          top: 0;
          z-index: 1;
          color: #fff;
          padding: 48px;
          background: @color;
          border-radius: 10px;
        }
      }
      .time {
        color: #ccc;
        width: fit-content;
        text-align: center;
        margin-bottom: 62px;
        .ntime {
          font-size: 18px;
          line-height: 18px;
        }
        .rtime {
          font-size: 72px;
          line-height: 72px;
          margin-bottom: 14px;
        }
      }

      .title {
        font-size: 24px;
        line-height: 24px;
        color: #333;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-bottom: 26px;
      }
      .main {
        color: #666666;
        font-size: 16px;
        line-height: 34px;
        margin-bottom: 64px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
      }

      .fa {
        font-size: 27px;
        color: #d1cbcb;
      }
    }
  }
}

.pub_news .content{
  display: none;
}

.footer{
  background: #000;
  padding-top: 102px;
  // max-height: 318px;
  .con1600{
    display: flex;
    justify-content: space-between;
    height: 216px;
    .left{
      display: flex;
      .info{
        display: flex;
        flex-direction: column;
        span{
          &:nth-child(1){
            font-size: 16px;
            color: #666666;
          }
          &:nth-child(2){
            font-size: 40px;
            line-height: 74px;
            color: #ccc;
          }
          &:nth-child(3){
            font-size: 16px;
            color: #ccc;
          }
        }
      }
    }
    .right{
      display: flex;
      align-items: center;
      flex-direction: column;
      color: #999;
      .top{
        img{
          margin-bottom: 10px;
        }
        p{
          font-size: 13px;
          margin-bottom: 10px;
        }
      }
      .bottom{
        font-size: 14px;
      }
    }
    .nav{
      width: 45%;
      margin-left: 15%;
      .title{
        font-size: 16px;
    color: #666666 !important;
    width: 100%;
      }
      a{
    width: 26% !important;

      }
      li{
        font-size: 16px;
    color: #ccc !important;
    margin-right: 15px;
    line-height: 56px;
      }
      ul{
        display: flex;
        flex-wrap: wrap;
      }
    }
  }
}

.banner{
  margin-top: 90px;
}

.pub_top_nav{
  justify-content: center;
  // justify-content: start;
  flex-wrap: wrap;
  font-size: 20px;
  color: #666666;
  line-height: 60px;
  border-bottom: 1px solid #bfbfbf;
  li{
    width: 25%;
    text-align: center;
    &:hover{
      color: #3490de;
    }
  }
  .hover{
    color: #3490de;
  }
}

.product_center_nav{
  justify-content: start;
}

.about{
  padding: 98px 0;
  font-size: 18px;
          color: #666666;
          line-height: 42px;
          text-align: justify;
          display: block;
          font-weight: lighter;
  .top{
    display: flex;
    align-items: center;
    .left{
      width: 46%;
      justify-content: space-between;
      p{
        &:nth-child(1){
          font-size: 22px;
          color: #3490de;
          line-height: 40px;
          margin-bottom: 50px;
          font-weight: bold;
        }
      }
    }
    margin-bottom: 95px;
  }
  .bottom{
    margin-top: 393px;
    position: relative;
    video{
      position: relative;
      top: -298px;
    }
    .video_wrap{
      cursor: pointer;
  
    }
    .play{
      position: absolute;
      top: -19px;
      left: 50%;
      transform: translate(-50%;-50%);
      font-size: 32px;
      color: #fff;
      display: flex;
      flex-direction: column;
      align-items: center;

      img{
        margin-bottom: 32px;
      }
    }
    .wrap{
      background: #f4f4f4;
    }
    .content{
      margin-top: -189px;
      padding-bottom: 148px;
    }
  }
}

.zizhi{
  height: 875px;
  display: flex;
  align-items: center;
  margin: 98px 0;
  background: url('../images/zizhi_bg.png');
  .content{
    li{
      width: 322px;
      text-align: center;
      &:nth-child(even){
        margin-top: 58px;
      }
      &:nth-child(1){
              animation: 1s fadeInUp both;
          }
          &:nth-child(2){
              animation: 1.2s fadeInUp both;
          }
          &:nth-child(3){
              animation: 1.4s fadeInUp both;
          }
      &:nth-child(4){
              animation: 1.6s fadeInUp both;
          }
      img{
        &:nth-child(1){
          margin-bottom: 3px;
        }
      }
    }
  }
}

.class_title{
  text-align: center;
  font-size: 36px;
  font-weight: lighter;
  margin-bottom: 78px;
  color: #000;
}

.product_center{
  padding: 98px 0 68px;
  .jgj{
          display: flex;
          align-items: center;
          justify-content: center;
          position: relative;
          &:hover{
              box-shadow: 0 0 10px #ccc;
              .title{
                  color: #3490de !important;
              }
              }
          a{
              width: 100%;
              height: 100%;
              display: flex;
              flex-direction: column;
              align-items: center;
              justify-content: center;
          }
          .title{
              position: absolute;
              bottom: 18px;
              background: none !important;
              color: #000 !important;
              font-weight: lighter !important;
          }
  }
  
  .con1600{
    flex-wrap: wrap;
    justify-content: start;
    position: relative;
    li{
        a{
            &:hover{
        img{
          transform: scale(1.03);
          overflow: hidden;
          transition: 1s;
        }
      }
        }
      margin-bottom: 27px;
      margin-right: 27px;
      .wrap{
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
      }
      width: 23.7%;
      text-align: center;
      &:nth-child(4n+4){
        margin-right: 0 !important;
      }
      .title{
        font-size: 18px;
        color: #fff;
        line-height: 43px;
        background: #4b9fe1;
        font-weight: lighter;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
      }
    }
  }
}

.index_banner_pic{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

.product_xq{
  padding: 98px 0;
  display: block;
  .top{
    display: flex;
    justify-content: space-between;
    align-items: center;
    // width: 32.6%;
    width:100%;
    margin-bottom: 75px;

    .left{
      width: 32.6%;
    }
    .right{
      width: 63.5%;
      .path{
        font-size: 16px;
        color: #999999;
        font-weight: lighter;
        margin-bottom: 67px;
        .hover{
          color: #000;
        }
        a{
          &:hover{
            color: #000;
          }
          
        }
        i{
          font-size: 18px;
          margin: 0 9px;
        }
      }
      .title{
        font-size: 24px;
        margin-bottom: 35px;

      }
      .ms{
        border-top: 1px solid #eeeeee;
        font-size: 17px;
        font-weight: lighter;
        line-height: 37px;
        margin-bottom: 86px;
        padding-top: 31px;
      }
      .contact{
        display: block;
        padding: 0 46px;
        width: fit-content;
        background: #eeeeee;
        border-radius:30px;
        line-height: 47px;
        font-size: 16px;
        font-weight: lighter;
        &:hover{
          background: #f8b551;
          color: #fff;
        }
      }
    }
  }
  .wrap{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .bottom{
    .pd_nav{
      display: flex;
      li{
        text-align: center;
        background: #eee;
        flex: 1;
        font-size: 20px;
        a{
          display: block;
          line-height: 65px;
        }
        &.hover{
          background: #3490de;
          color: #fff;
        }
        &:hover{
          .hover
        }
        &:nth-child(2){
          border-width: 0 1px;
          border: 1px solid #fff;
        }
      }
    }
    .content{
      padding: 60px 62px 0;
      font-size: 18px;
    line-height: 42px;
    li{
      font-weight: lighter;
    }
    table,table tr th, table tr td {
      border: 1px solid #7c7b79;
    }
    table{
      margin-top: 12px;
      width: 100%;
      th,td{
        text-align: center;
      }
    }
    .technical,.shape{
      
      table{
        margin-top: 12px;
        width: 100%;
        thead{
          background: #848283;
          color: #fff;
          line-height: 37px;
          font-size: 20px;
        }
        tbody{
          line-height: 36px;
          tr{
            &:nth-child(2n){
              background: #c5e5fa;
            }
            td{
              &:nth-child(2){
                text-align: center;
              }
            }
          }
        }
      }
    }
    .title{
      font-size: 20px;
      color: #3490de;
      font-weight: normal;
      padding-bottom: 16px;
      span{
        font-weight: bold;
      }
    }

    .shape{
      .table_wrap{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
      }
      table{
        width: 45%;
        .tab_head{
          background: #848283;
          color: #fff;
          font-size: 20px;
        }
        tbody{
          tr{
            td{
              text-align: center !important;
              padding-left: 0 !important;
            }
            &:nth-child(2n){
              background: #c5e5fa;
            }
          }
        }
        
      }
    }
    }
  }
}

.news_center{
  padding: 98px 0;
  display: block;
  margin-bottom: 0;
  ul{
    flex-wrap: wrap;
    li{
      margin-bottom: 26px;
    }
  }
}

.news_read{
  padding: 98px 0;
  .news_typename{
    margin-bottom: 64px;
  }
  h1{
    font-size: 30px;
    line-height: 30px;
    color: #333;
    font-weight: bold;
    text-align: center;
    margin-bottom: 23px;
  }
  .time{
    font-size: 18px;
    line-height: 18px;
    text-align: center;
    margin-bottom: 72px;
  }

  hr{
    background-color: #d2d2d2;
    border: none;
    height: 1px;
    &:nth-child(2){
      margin-bottom: 80px;
    }
  }

  .read_con{
    font-size: 18px;
    color: #666666;
    line-height: 38px;
    p{
      margin-bottom: 5px;
      &:last-child{
        margin-bottom: 0;
      }
    }
  }

  .news_con{
    margin-bottom: 30px;
  }

  .cc_pro{
    ul{
      display: flex;
      justify-content: space-between;
      li{
        padding: 9px 56px;
        background: #eee;
        font-weight: lighter;
        font-size: 20px;
        &:hover,&.article_return{
          background: #3490de;
          color: #fff;
        }

      }
    }
    
  }
}

.renli{
  padding: 98px 0;
  .title{
    text-align: center;
    font-size: 36px;
    font-weight: lighter;
    margin-bottom: 89px;
  }
  .top{
    margin-bottom: 98px;
    
    .content{
      .left{
        width: 790px;
        height: 501px;
        background: #3490de;
        display: flex;
        align-items: center;
        padding: 0 74px;
        font-size: 16px;
        font-weight: lighter;
        color: #fff;
        line-height: 37px;
      }
    }
  }
  .bottom{
    table{
      width: 100%;
      thead{
        font-size: 21px;
        line-height: 84px;
        font-weight: lighter;
        color: #000;
        tr{
          background: #e2f2fc;
        }
      }

      tbody{
        line-height: 110px;
        font-size: 18px;
        tr{
          border-bottom: 1px solid #eeeeee;
        }
      }
      td{
        text-align: center;
      }
    }
    
  }
}

.contact{
  padding: 98px 0;
  .top{
    display: flex;
    justify-content: space-between;
    margin-bottom: 98px;
    .left{
      width: 34.6%;
      background: #3490de;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      .content{
        width: 72.3%;
      }
      .ctitle{
        font-size: 24px;
        color: #fff;
        margin-bottom: 11px;
      }
      .etitle{
        font-size: 18px;
        color: #66ccff;
        margin-bottom: 54px;
      }
      .ms{
        font-size: 16px;
        color: #666;
        line-height: 34px;
        margin-bottom: 81px;
      }
      .lx{
        li{
          display: flex;
          flex-direction: column;
          font-size: 16px;
          color: #fff;
          line-height: 42px;
          border-top: 1px solid #3399ff;
          span{
            &:nth-child(1){
              font-weight: lighter;
            }
          }
        }
      }
    }

    .right{
      width: 65.4%;
      .amap_box{
        padding: 0;
      }
      #amap_container{
        height: 760px;
      }
    }
  }

  .bottom{
    display: flex;
    justify-content: space-between;
    .right{
      flex-direction: column;
      align-items: center;
      .title{
        font-size: 30px;
        color: @color;
        line-height: 30px;
        margin-bottom: 30px;
      }
      .ms{
        font-size: 16px;
        line-height: 16px;
        color: #333333;
        margin-bottom: 84px;
      }
    }
    form{
      width: 100%;
      height: 626px;
      background: #fafafa;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
    }
  }
}

.mess_form{
  width: 87.8%;
  .input{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  input,textarea{
    height: 45px;
    border: 1px solid #d2d2d2;
    background: #fbfbfb;
    margin-bottom: 42px;
    padding-left: 10px;
  }

  textarea{
    width: 100%;
    line-height: 45px;
    height: 223px;
  }

}
.form_btn{
  display: flex;
  justify-content: right;
  input{
    border: 2px solid #f0f0f0;
    padding: 14px 60px;
    font-size: 18px;
    line-height: 18px;
    color: #fff;
    &:nth-child(1){
      background: @color;
      margin-right: 15px;
    }
    &:last-child{
      background: #000;
    }
  }
}